<template>
	<el-dialog title="移动文件夹" :modal-append-to-body="false" :visible.sync="moveVisible" width="520px">
		<div class="rename-content">
			<el-tree ref="asyncTree" @node-click="moveChoose" lazy :load="loadNode" :props="props" :data="treeFrom"
				node-key="id" :expand-on-click-node="false">
				<span class="custom-tree-node" slot-scope="{ node, data }">
					<img v-if="data.src" class="svg-icon" :src="data.src">
					<img v-else class="svg-icon" :src="node.expanded?flatFileIcon:folderIcon">
					<span class="document-left-tree-span">{{data.label}}</span>
				</span>
			</el-tree>
		</div>
		<span slot="footer" class="dialog-footer">
			<el-button @click="moveVisible = false">取 消</el-button>
			<el-button type="primary" @click="saveMove">确 定</el-button>
		</span>
	</el-dialog>
</template>

<script>
	import {
		getTreeData,
		dirIsLeaf,
		moveTree
	} from '@/api/dir.js'
	import {
		update
	} from '@/api/doc.js'
	export default {
		data() {
			return {
				moveVisible: false,
				treeFrom: [{
					id: -1,
					label: '项目',
					src: require("../../../../img/0aa34d50b616e6482cfb8ea7cf251d5b.svg"),
					isLeaf: false,
					children: null,
					data: {
						dirLevel: 0,
						dirType: '00',
					}
				}],
				props: {
					isLeaf: 'isLeaf',
					label: 'label',
					children: [],
				},
				listQuary: {
					current: 1,
					level: 0,
					parentId: '',
					dirType: ''
				},
				parentNode: {},
				originalObject: {},
				times: null,
				folderIcon:require("../../../../img/8eacfb1a6bafde0a172c6b393950dab8.svg"),
				flatFileIcon: require("../../../../img/53291f9df1685d566be7cc967d80d249.svg"),
				type: ''
			}
		},
		props: ['dircontract'],
		methods: {
			// 请求父组件并弹出弹窗
			loadMove(data, type) {
				console.log('55555555555555555555555555556666666666666666666666666666666');
				console.log(data)
				var _this = this
				_this.type = type
				_this.originalObject = data
				_this.treeFrom = [{
					id: -1,
					label: '项目',
					src: require("../../../../img/0aa34d50b616e6482cfb8ea7cf251d5b.svg"),
					children: null,
					isLeaf: false,
					data: {
						dirLevel: 0,
						dirType: '00',
					},
				}]
				_this.treeFrom[0].data.dirType = data.data.dirType
				if (data.data.dirType == '00') {
					if(this.dircontract==true){
						_this.treeFrom[0].label = '项目合同'
					}else{
						_this.treeFrom[0].label = '项目'
					}
				} else if (data.data.dirType == '01') {
					_this.treeFrom[0].label = '任务'
				} else if (data.data.dirType == '02') {
					_this.treeFrom[0].label = '产品'
				} else if (data.data.dirType == '04') {
					_this.treeFrom[0].label = '我的文档'
				} else if (data.data.dirType == '05') {
					_this.treeFrom[0].label = '普通合同'
				}else if (data.data.dirType == '06') {
					_this.treeFrom[0].label = '知识库'
				}
				console.log(_this.treeFrom)
				this.moveVisible = true
			},
			// 加载叶子
			loadNode(node, resolve) {
				var _this = this
				if (node.level === 0) {
					resolve(node.data)
				}
				if (node.level >= 1) {
					var id = ''
					_this.listQuary.level = Number(node.data.data.dirLevel) + 1
					_this.listQuary.dirType = node.data.data.dirType
					_this.listQuary.parentId = node.data.data.dirId
					if (node.data.data.dirLevel > 0) {
						getTreeData(_this.listQuary).then(res => {
							resolve(res.data.data)
						})
					} else {
						getTreeData({
							dirType: node.data.data.dirType,
						}).then(res => {
							resolve(res.data.data)
						})
					}
				}
			},
			// 选择父节点
			moveChoose(node) {
				console.log(node)
				this.parentNode = node
			},
			// 确定移动
			saveMove() {
				var _this = this
				if (_this.type == 'file') {
					if(!_this.parentNode.data){
					   this.$message.error('请选择父节点');
					   return;
					}
					if(_this.parentNode.data.dirId == _this.originalObject.data.dirId){
            this.$message.error('父级不能选择本身');
            return;
          }
					if(_this.parentNode.data.dirId){
						update({
							docId: _this.originalObject.data.docId,
							dirId: _this.parentNode.data.dirId
						}).then(res => {
							_this.moveVisible = false
							_this.updateDocList(_this.originalObject.data)
							_this.$message({
								showClose: true,
								message: '操作成功',
								type: 'success'
							});
						})
					}else{
					    this.$message.error('请选择目录')
						return;
					}
				} else {
					if(!_this.parentNode.data){
					   this.$message.error('请选择父节点');
					   return;
					}
          if(_this.parentNode.data.dirId == _this.originalObject.data.dirId){
            this.$message.error('父级不能选择本身');
            return;
          }
					if (_this.parentNode.data.dirLevel > 0) {
						moveTree({
							id: _this.originalObject.data.dirId,
							parentId: _this.originalObject.data.parentDirId,
							newParentId: _this.parentNode.data.dirId
						}).then(res => {
							this.moveVisible = false
							var oldForm = {
								type: 'move',
								parentId: _this.originalObject.data.parentDirId
							}
							this.$emit('updateTree', _this.parentNode)
							_this.$message({
								showClose: true,
								message: '操作成功',
								type: 'success'
							});
						})
					} else {
						moveTree({
							id: _this.originalObject.data.dirId,
							parentId: _this.originalObject.data.parentDirId,
							newParentId: ''
						}).then(res => {
							this.moveVisible = false
							var oldForm = {
								type: 'move',
								parentId: _this.originalObject.data.parentDirId
							}
							this.$emit('updateTree', _this.parentNode)
							_this.$message({
								showClose: true,
								message: '操作成功',
								type: 'success'
							});
						})
					}
				}
			},
			// 更新文档
			updateDocList(data){
				var docForm = {
					data:data,
					type:'move'
				}
				this.$EventBus.$emit('updateDoc',docForm)
			}
		}
	}
</script>

<style scoped>
	.rename-content {
		display: flex;
		flex-direction: column;
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.custom-tree-node {
		flex: 1;
		display: flex;
		align-items: center;
		justify-content: space-between;
		font-size: 14px;
		padding-right: 40px;
		color: white;
	}

	.custom-tree-node:hover {
		color: #909BAA;
	}

	.svg-icon {
		width: 18px;
		height: 18px;
		margin-right: 6px;
		flex-shrink: 0;
	}

	.document-left-tree-span {
		flex: 1;
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		color: #5f6d84;
		font-size: 14px;
	}

	/deep/.el-dialog .el-dialog__footer {
		border-color: white;
	}

	/deep/.el-dialog__title {
		font-weight: bold;
		font-size: 16px;
	}
</style>
